<!doctype html>
<html lang="es">
	<head>
		<meta charset="UTF-8">
		<title>3 En Raya</title>
		<link rel="stylesheet/less" type="text/css" href="style.less">
		<script src="/socket.io/socket.io.js"></script>
		<script src="js/less-1.3.3.min.js"></script>
		<script src="js/jquery-1.9.1.min.js"></script>
		<script src="js/core.js"></script>
	</head>
	<body>

		<div id="latencia">Latencia: <span></span> segs.</div>

		<div id="login-contenedor">
			<div id="login">
				<h3>¿Cual es tu nombre?</h3>
				<input type="text" name="nick" placeholder="..." maxlength="20">
				<p class="error"></p>
			</div>
		</div>

		<div id="contenedor">

			<h1 class="titulo">3 En Raya</h1>

			<div id="minicontenedor">
				<div id="tablero">
					<div class="fila">
						<div class="columna"></div>
						<div class="columna"></div>
						<div class="columna"></div>
					</div>
					<div class="fila">
						<div class="columna"></div>
						<div class="columna"></div>
						<div class="columna"></div>
					</div>
					<div class="fila">
						<div class="columna"></div>
						<div class="columna"></div>
						<div class="columna"></div>
					</div>
				</div>

				<div id="jugadores">
					<div class="estado" data-jugador="1">
						<div class="figura">X</div>
						<div class="nombre">Esperando jugador...</div>
					</div>
					<div class="estado" data-jugador="2">
						<div class="figura">O</div>
						<div class="nombre">Esperando jugador...</div>
					</div>
					<div id="unirse">
						Unirme
					</div>
				</div>
			</div>

			<div id="chat">
				<div id="sala">
					<div class="texto">

					</div>
					<textarea placeholder="..."></textarea>
				</div>
				<div id="usuarios">
				</div>
			</div>

		</div>
	</body>
</html>